<template>
	<div class="refundju">
		<ul class="refund-orderxinxi">
			<li>退款编号：<span v-text="refundxinxi.refund_sn"></span></li>
			<li>申请时间：<span v-text="created"></span></li>
			<li>退款状态：<span v-if="refundxinxi.status=='WAIT_SELLER_AGREE'" v-text="refundxinxi.member_status==1?'您已成功发起了退款，请耐心等待商家处理':'买家发起了退款，请您及时处理'"></span>
				<span v-if="refundxinxi.status=='CLOSED'">退款关闭</span>
				<span v-if="refundxinxi.status=='SUCCESS'" v-text="refundxinxi.member_status==1?'商家已同意您的退款申请，退款成功':'您已同意买家的退款申请，退款成功'">退款成功</span>
				<span v-if="refundxinxi.status=='SELLER_REFUSE_BUYER'" v-text="refundxinxi.member_status==1?'商家拒绝了您的退款申请，请您修改后提交':'您拒绝了买家的退款申请，请等待买家回应'"></span>
				<span v-if="refundxinxi.status=='WAIT_ADMIN_AGREE'" v-text="refundxinxi.member_status==1?'商家同意了您的退款申请，请耐心等待管理员审核':'您同意了买家的退款申请，等待管理员审核'"></span>
				<span v-if="refundxinxi.status=='WAIT_SELLER_CONFIRM'" v-text="refundxinxi.member_status==1?'您已成功修改了退款申请，请耐心等待商家处理':'买家修改了退款申请，请您及时处理'"></span>
			</li>
			<li>商品总额：<span v-text="refundxinxi.total_fee+'元'"></span></li>
			<li>退款金额：<span v-text="refundxinxi.refund_fee+'元'"></span></li>
			<li>退款原因：<span v-text="refundxinxi.refund_reason">其他</span></li>
			<li>退款备注：<span v-text="refundxinxi.refund_desc">收到商品已经烂了</span></li>
		</ul>
		<div class="jujueshuoming">
			<span>拒绝说明：</span>
			<textarea name="" rows="2" cols="" placeholder="请输入拒绝说明" v-model="refundtext"></textarea>
		</div>
		<div class="refund-imglist">
			<h3>图片举证</h3>
			<div><span v-if="sendimg"><img src="../../img-order/photo@3x.png"/><input type="file" name="" id="" value="" accept="image/*" @change="imagetian()"/></span>
				<span v-for="(item,index) in imglist"><img :src="item"/><span @click="deleimg(index)"><img src="../../img-order/icon_close@3x.png"/></span></span></div>
		</div>
		<div class="refundjusend" @click="refundjusend">提交</div>
		<div class="canvas-box">
			<canvas id="canvas"></canvas>
		</div>
	</div>
</template>

<script>
	export default{
		name:'refundju',
		data () {
			return{
				sendimg:true,
				user:0,
				refundid:'',
				refundxinxi:'',
				created:'',
				imglist:[],
				refundtext:''
			}
		},
		created:function(){
			this.user=localStorage.getItem("nt_user");
			this.refundid=this.$route.query.refundid;
		},
		methods:{
			imagetian:function(){
				var self=this;
				var dataUrl=$('input[type=file]')[0].files[0];
				var reader = new FileReader();
                //读取文件过程方法
                reader.onload = function (e) {
//                  console.log("成功读取....");
                    self.imglist.push(e.target.result);
                    $('input[type=file]')[0].value="";
                    if(self.imglist.length>=8){
                    	self.sendimg=false;
                    }
                    //或者 img.src = this.result;  //e.target == this
                }

                reader.readAsDataURL(dataUrl);				
			},
			deleimg:function(ind){
				this.imglist.splice(ind,1);
				console.log(this.imglist.length)
				if(this.imglist.length<8){
					this.sendimg=true;
				}
			},
			refundjusend:function(){
				var self=this;
				$.ajax({
					type:"post",
					url:furl+"index.php?app=ajax_refund&act=seller_refuse",
					data:{'token':self.user,'refund_id':self.refundid,'refund_cert':self.imglist,"content":self.refundtext},
					dataType:'json',
					success:function(res){
						if(res.done){
							history.go(-1);
						}else{
							alert(res.msg);
						}
					}
				});
			}
		},
		mounted:function(){
			var self=this;
			$.ajax({
				type:"get",
				url:furl+"index.php?app=ajax_refund&act=seller_refuse",
				data:{'token':self.user,'refund_id':self.refundid},
				dataType:'json',
				success:function(res){
					self.refundxinxi=res.retval;
					self.created=new Date(Number(res.retval.created)*1000).Format("yyyy-MM-dd hh:mm:ss");
				}
			});
		}
	}
</script>

<style>
	.refundju{margin-top:-0.98rem;font-size:0;}
	.canvas-box{height:0;overflow: hidden;}
	.jujueshuoming{padding:0.3rem 0.32rem 0.2rem;background-color:#fff;margin-bottom: 0.1rem;}
	.jujueshuoming>span{font-size:0.28rem;color:#2b2b2b;float:left;}
	.jujueshuoming>textarea{width:70%;font-size: 0.28rem;color:#2b2b2b;line-height: 0.42rem;}
	.refundjusend{width:6.86rem;height:1rem;border-radius:0.5rem;background-color:#4C9D31;margin:0.6rem auto;text-align: center;line-height: 1rem;color:#fff;font-size:0.36rem;letter-spacing: 0.2rem;box-sizing: border-box;padding-left: 0.2rem;}
</style>